.karmaCounter > * + * {
    padding: 0 0 0 4px;
}

.karmaValue {
    color: var(--greyC4);
    font-size: 12px;
    line-height: 14px;
}

svg.down {
    transform: rotate(180deg);
}

@media all and (min-width: 1024px) {
    .karmaCounter {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-flow: column nowrap;
    }

    .karmaCounter > * + * {
        padding: 7px 0 0;
    }

    .karmaValue {
        font-size: 14px;
        line-height: 16px;
        color: var(--black);
    }
}

@media all and (min-width: 1540px) {
    .karmaCounter > button.up:hover > svg > path {
        fill: var(--green);
    }

    .karmaCounter > button.down:hover > svg > path {
        fill: var(--orange);
    }
}